/* This file is virtually the same as "main_menu.css",
   except it uses ".menu" in the place of "#mainMenu", to enable a general-purpose
   styling of menus throughout the app.  I am keeping "main_menu.css" though in case 
   I want some custom styling for that menu.
*/

ul.menu,ul.menu ul{
	margin:0;list-style:none;padding:0;background-color:#dedede;border-width:1px;border-style:solid;border-color:#5f5f5f;-moz-border-radius:9px;-webkit-border-radius:9px;border-radius:9px;}
ul.menu ul {
  
	display:none;
  position:absolute; left:0; top:100%;
  -moz-box-shadow:3.5px 3.5px 5px #000000;  -webkit-box-shadow:3.5px 3.5px 5px #000000;  box-shadow:3.5px 3.5px 5px #000000;
  padding:0 10px 10px;
  background-color:#313131;
  border-radius:6px; -moz-border-radius:6px; -webkit-border-radius:6px;    
  border-color:#d4d4d4;
  z-index: 5001;
}

ul.menu li:hover>*{
	display:block;}
ul.menu li:hover{
	position:relative;}
ul.menu ul ul{
	position:absolute;left:100%;top:0;}
ul.menu{
	display:block;font-size:0;}
ul.menu li{
	display:block;white-space:nowrap;font-size:0;float:left;}
ul.menu>li,ul.menu li{
	margin:0;}
ul.menu a:active, ul.menu a:focus{
	outline-style:none;}
ul.menu a,ul.menu a.pressed{
	display:block;vertical-align:middle;text-align:left;text-decoration:none;font:14px Trebuchet MS;color:#e2e2e2;text-shadow:#FFF 0 0 1px;cursor:pointer;}
ul.menu ul li{
	float:none;margin:10px 0 0;}
ul.menu ul a{
	text-align:left;padding:4px;background-color:#313131;background-image:none;border-width:0;border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;font:14px Trebuchet MS;color:#e2e2e2;text-decoration:none;}
ul.menu li:hover>a{
	background-color:#ff9c08;border-color:#C0C0C0;border-style:solid;font:14px Trebuchet MS;color:#000000;text-decoration:none;text-shadow:#FFF 0 0 1px;background-image:url("");background-position:0 100px;}
ul.menu img{
	border:none;vertical-align:middle;margin-right:10px;}
ul.menu img.over{
	display:none;}
ul.menu li:hover > a img.def{
	display:none;}
ul.menu li:hover > a img.over{
	display:inline;}
ul.menu li a.pressed img.over{
	display:inline;}
ul.menu li a.pressed img.def{
	display:none;}
ul.menu span{
	display:block;overflow:visible;background-position:right center;background-repeat:no-repeat;padding-right:0px;}
	
ul.menu a{

	padding:10px;
	background-color:#313131;
	/*
	background-image:url("");
	*/
	background-repeat:repeat;
	background-position:0 0;
	border-width:0 0 0 1px;  border-style:solid;   border-color:#444;
	color:#e2e2e2;
	text-decoration:none;
	text-shadow:#FFF 0 0 1px;
	
}

ul.menu li:hover>a,ul.menu li>a.pressed{
	background-color:#ff9c08;background-image:url("");background-position:0 100px;border-style:solid;border-color:#C0C0C0;color:#000000;text-decoration:none;text-shadow:#FFF 0 0 1px;}
ul.menu ul li:hover>a,ul.menu ul li>a.pressed{
	background-color:#f19007;background-image:none;font:14px Trebuchet MS;color:#111111;text-decoration:none;}
ul.menu li.topfirst>a{
	border-radius:9px 0 0 9px;-moz-border-radius:9px 0 0 9px;-webkit-border-radius:9px;-webkit-border-top-right-radius:0;-webkit-border-bottom-right-radius:0;}
ul.menu li.toplast>a{
	border-radius:0 9px 9px 0;-moz-border-radius:0 9px 9px 0;-webkit-border-radius:0;-webkit-border-top-right-radius:9px;-webkit-border-bottom-right-radius:9px;}
